<route lang="json5">
{
  layout: 'tabbar',
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '约会广场',
  },
}
</route>

<template>
  <view class="relative">
    <!-- 导航 -->
    <!--  #ifdef MP-WEIXIN -->
    <wd-navbar 
      placeholder 
      safeAreaInsetTop 
      title="约会广场" 
    ></wd-navbar>
    <!--  #endif -->
    <view class="w-full h-46rpx"></view>
    <view class="w-center rounded-16rpx !mb-14rpx h-152rpx color-#fff flex-a-center px-44rpx box-border bg-linear-5"
      v-for="(item, index) in list"
      :key="item.path"
      @click="toPath(item, index)"
    >
      <image :class="item.iconClass" mode="aspectFit" :src="item.icon"></image>
      <view class="font-size-36rpx" :class="[index === 0 ? 'ml-32rpx' : 'ml-19rpx']">{{ item.label }}</view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { share } from "@/enum";
import { addIcon, toLoveIcon } from "@/static/base64";
import { useCommonStore, useUserStore } from '@/store';
import { useToast } from "wot-design-uni";

const common = useCommonStore();
const menuButtonHeight = ref(0);
// #ifdef MP-WEIXIN
menuButtonHeight.value = common.menuButtonHeight;
// #endif
const list = ref([
  { icon: addIcon, iconClass: 'add-icon', label: '发布约会', path: '/activity/release' },
  { icon: toLoveIcon, iconClass: 'to-love-icon', label: '去约会', path: '/activity/square' },
])

const user = useUserStore();
const toast = useToast();
const toPath = (item, index) => {
  if (!user.isLogined) {
    uni.navigateTo({ url: '/pages/login/index' });
    return
  }
  if (!user.activityInfo.id) {
    toast.show('请先填写资料');
    setTimeout(() => {
      uni.navigateTo({ url: '/activity/addActivityInfo?type=' + (index + 1) })
    }, 1000)
    return
  }
  uni.navigateTo({ url: item.path })
}

onShareAppMessage(() => {
  const id = user.userInfo.id || '';
  return {
    title: '我满心期待，与你相遇的未来！',
    path: `/pages/tabbar/index?instrId=${id}`,
    imageUrl: share
  }
})
</script>

<style lang="scss" scoped>
.add-icon {
  width: 93rpx;
  height: 93rpx;
}

.to-love-icon {
  width: 106rpx;
  height: 106rpx;
}
</style>
